<template>
  <div class="wrap" :style="{minHeight:$store.state.minHeight+'rem'}">
    <myHead title="营业资质"></myHead>
    <div class="photo">
      <img v-for="(x,y) in imgList" :src="x" @click="lookImg(y)">
    </div>
    <van-image-preview v-model="show" :images="imgList" :show-indicators="true" :start-position="index" :show-index="false"></van-image-preview>
  </div>
</template>

<script>
  import myHead from "../../components/ClientComponents/lib/myHead";
  export default {
    name: "BusinessQualification",
    components:{
      myHead
    },
    data(){
      return {
        index:0,
        show:false,
        imgList:['../../../static/img/wdfbtu1.png','../../../static/img/wdfbtu1.png']
      }
    },
    methods:{
      lookImg(index){
        this.show = true;
        this.index = index;
      }
    }
  }
</script>

<style scoped>
  .wrap {
    box-sizing: border-box;
    padding-top: .5rem;
    background-color: #F5F5F5;
  }
  .photo>img {
    width: 48%;
    height: 80%;
  }
  .photo {
    width: 95%;
    box-sizing: border-box;
    padding: 0 .1rem;
    height: 1.2rem;
    margin: .1rem auto;
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-around;
    border-radius: .1rem;
    background-color: #FFFFFF;
  }

  /* 预览图下标显示 */
  /deep/ .van-image-preview__index {
    top: .1rem;
    color: #fff;
    font-size: .14rem;
    text-shadow: 0 .01rem .01rem #323233;
  }
  >>> .van-swipe__indicators {
    bottom: .2rem;
  }
  >>> .van-swipe__indicator {
    width: .06rem;
    height: .06rem;
  }
  >>> .van-swipe__indicator:not(:last-child) {
    margin-right: .06rem;
  }
</style>
